<template>
  <div class="app-container ">
    
    <el-card >
      <el-tabs v-model="activeName" type="card" @tab-click="handleClick" size="small" >
        <el-tab-pane label="链接" name="link"></el-tab-pane>
        <el-tab-pane label="文章" name="article"></el-tab-pane>
        <el-tab-pane label="PDF" name="PDF"></el-tab-pane>
      </el-tabs>
      <div class="el-flex">
        <div class="el-flex-1 el-title">
            雷达{{type}} （共2个）
        </div>
        <div>
           <el-input v-model="keyword" placeholder="请输入关键字" prefix-icon="el-icon-search" size="small"></el-input>
        </div>
        <el-button type="primary" size="small" style="margin-left:10px" @click="addRadar()">新建雷达{{type}}</el-button>
      </div>
      <el-table
        :data="list"
        size="small"
        :header-cell-style="{'background':'#fafafa'}"	
        style="width: 100%;margin-top:15px">
        <el-table-column  prop="radar"  label="雷达"  > </el-table-column>
        <el-table-column  prop="title"  label="雷达标题"  > </el-table-column>
        <el-table-column  prop="tag"  label="客户标签"  > </el-table-column>
        <el-table-column  prop="user"  label="创建人"  > </el-table-column>
        <el-table-column  prop="num"  label="点击人数"  > </el-table-column>
        <el-table-column  prop="time"  label="创建时间"  > </el-table-column>
        <el-table-column   label="操作" align="right" >
           <template slot-scope="{row}">
               <el-button type="text" size="small">分享</el-button>
               <el-divider direction="vertical"></el-divider>
               <el-button type="text" size="small">数据</el-button>
               <el-divider direction="vertical"></el-divider>
               

               <el-dropdown>
                <el-button type="text" size="small" class="el-dropdown-link">编辑 <i class="el-icon-arrow-down el-icon--right"></i></el-button>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item>修改</el-dropdown-item>
                  <el-dropdown-item>删除</el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
           </template>
        </el-table-column>
        <div slot="empty">
             <el-empty description="暂无数据~"></el-empty>
        </div>
      </el-table>
    </el-card>
    
  </div>
</template>
<script>
  export default {
    data() {
      return {
        activeName: 'link',
        type:'链接',
        list:[],
        listLink:[
          {radar:'1122',title:'元旦帖子',tag:'元旦活动',user:'杨红玲',num:'2',time:'2021-12-13 22:36'},
          {radar:'1122',title:'元旦帖子',tag:'元旦活动',user:'杨红玲',num:'2',time:'2021-12-13 22:36'},
        ],
      };
    },
    mounted(){
      this.list=this.listLink
    },
    methods: {
      handleClick(tab, event) {
        this.type=tab.label
        this.activeName=tab.name
        if(tab.index!=0){
          this.list=[]
        }else{
          this.list=this.listLink
        }
      },
      addRadar(){
        this.$router.push({path:'/operate/radar/add',query:{type:this.activeName}})
      }
    }
  };
</script>
<style scoped lang="scss">
.el-title{
   font-weight: 600;
   font-size: 14px;
}
</style>